<template>
  <a-modal
    :title="title"
    :visible="open"
    :confirm-loading="submitLoading"
    @cancel="handleClose"
    :destroyOnClose="true"
    :footer="null">
    <a-upload-dragger
      name="file"
      :headers="headers"
      :action="importUrl"
      :multiple="false"
      @change="handleSubmit">
      <p class="ant-upload-drag-icon">
        <a-icon type="inbox" />
      </p>
      <p class="ant-upload-hint">
        单击或拖动文件到此区域以上传
      </p>
    </a-upload-dragger>
  </a-modal>
</template>
<script>
import storage from 'store'
import { ACCESS_TOKEN } from '@/store/mutation-types'

export default {
  data() {
    return {
      submitLoading: false,
      title: '',
      open: false,
      headers: {
        ACCESS_TOKEN: storage.get(ACCESS_TOKEN)
      },
      importUrl: process.env.VUE_APP_BASE_API + '/system/sysDict/importExcel'
    }
  },
  methods: {
    /** 点击关闭 */
    handleClose() {
      this.open = false
    },
    /** 点击导入 */
    handleImport() {
      this.title = '导入字典'
      this.open = true
    },
    /** 执行导入 */
    handleSubmit(info) {
      this.submitLoading = true
      if (info.file.status === 'done') {
        this.$message.success(info.file.response.msg)
        this.open = false
        this.$emit('ok')
      } else if (info.file.status === 'error') {
        this.$message.error(info.file.name + '文件上传失败')
      }
      this.submitLoading = false
    }
  }
}
</script>
